import React, { FC } from 'react';
import { Switch } from '@arco-design/web-react';

const ArcoDesign: FC = () => {
  const onChange: (checked: boolean) => void = (checked) => {
    const themDom = document.querySelector('.undefined-arco-main');
    if (themDom) {
      if (checked) {
        themDom.removeAttribute('arco-theme');
      } else {
        themDom.setAttribute('arco-theme', 'dark');
      }
    }
  };
  return (
    <>
      <h1 className="h1-title">
        标题
        <Switch
          checkedText="ON"
          onChange={onChange}
          uncheckedText="OFF"
          className="switch"
        />
      </h1>
      <div>101010</div>
    </>
  );
};

export default ArcoDesign;
